<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui" >

	<f:view contentType="text/html">
		
		<h:head>		
			<title><ui:insert name="head"></ui:insert></title>
			
			<meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
			
			<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
			
			<script src="#{request.contextPath}/js/bootstrap.js"></script>
			<link type="text/css" href="#{request.contextPath}/css/bootstrap.css" rel="stylesheet" />
		
			<link type="text/css" rel="stylesheet" href="#{request.contextPath}/css/style.css" />	
			<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon"/>
	
			<!-- Para los iconos de los botones etc -->
			<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"/>
			
			<script src="#{request.contextPath}/js/facebook.js"></script>			
		</h:head>

		<h:body>
			<div id="header" class="hidden-xs">
				<div class="container">
					<div id="header-title">
						<h1 class="animated fadeInDown">
							<a href="#{request.contextPath}/index.html">Marketplace <span>G1</span></a>
						</h1>
						<p class="animated fadeInLeft">Prototipo | Marketplace Grupo 1 | Tecnologo en Informatica 2013 </p>
					</div>
					
					<div id="social-header" class="dropdown hidden-xs">
						
						<a class="social-icon animated fadeInDown animation-delay-1 dropdown-toggle pull-right" data-toggle="dropdown" href="#">					
							<img src="#{request.contextPath}/img/logomarket3.png" style="width:22px"></img>
						</a>
						
						<div class="dropdown-menu dropdown-login animated fadeInUp pull-right">
							
							<h:form role="form">
								<h5 class="section-title">Bienvenido | Inicie sesion</h5>
								<div class="form-group">
									<div class="input-group login-input">
										<span class="input-group-addon">
											<i class="fa fa-envelope fa-fw"></i>
										</span>
										<p:inputText styleClass="form-control" type="text" placeholder="eMail" value="#{loginBean.email}" required="true"></p:inputText>
									</div>
									<br/>
									<div class="input-group login-input">
										<span class="input-group-addon">
											<i class="fa fa-lock fa-fw"></i>
										</span>
										<p:password styleClass="form-control" type="password" placeholder="Password" value="#{loginBean.password}" required="true"></p:password>
									</div>
									<p:messages id="messages" styleClass="alert alert-dismissable alert-danger" showDetail="true" autoUpdate="true" closable="true" />
									<br />
									<a href="#{request.contextPath}/clienteRegistro.xhtml"><button class="btn btn-primary btn-sm btn-info pull-left" type="button">Registrarse</button></a>
									<p:commandLink id="loginButton" value="Login" update="messages" actionListener="#{loginBean.login}" styleClass="btn btn-primary btn-sm pull-right"></p:commandLink>
									<!-- <button class="btn btn-primary btn-sm pull-right" type="submit">Login</button> -->
									<div class="clearfix"></div>
								</div>
							</h:form>
								
						</div>
						
						<a class="social-icon soc-facebook animated fadeInDown animation-delay-3 dropdown-toggle pull-right" data-toggle="dropdown" href="#">
							<i class="fa fa-facebook"></i>
						</a>
						
						<div class="dropdown-menu dropdown-login animated fadeInUp pull-right">
							
							<h:form role="form" style="background-color: #000000;">
								<h5 class="section-title">Bienvenido | Inicie sesion</h5>
								<div class="form-group">
									<div class="input-group login-input">
										<span class="input-group-addon">
											<i class="fa fa-envelope fa-fw"></i>
										</span>
										<p:inputText styleClass="form-control" type="text" placeholder="eMail" value="#{loginBean.email}" required="true"></p:inputText>
									</div>
									<br/>
									<div class="input-group login-input">
										<span class="input-group-addon">
											<i class="fa fa-lock fa-fw"></i>
										</span>
										<p:password styleClass="form-control" type="password" placeholder="Password" value="#{loginBean.password}" required="true"></p:password>
									</div>
									<p:messages id="messages" styleClass="alert alert-dismissable alert-danger" showDetail="true" autoUpdate="true" closable="true" />
									<br />
									<a href="#{request.contextPath}/clienteRegistro.xhtml"><button class="btn btn-primary btn-sm btn-info pull-left" type="button">Registrarse</button></a>
									<p:commandLink id="loginButton" value="Login" update="messages" actionListener="#{loginBean.login}" styleClass="btn btn-primary btn-sm pull-right"></p:commandLink>
									<!-- <button class="btn btn-primary btn-sm pull-right" type="submit">Login</button> -->
									<div class="clearfix"></div>
								</div>

	
								<p:commandLink id="fbButton" value="Login" update="messages" actionListener="#{facebookBean.doGet()}"
												styleClass="btn btn-fb pull-right fb-login-button" data-width="50" 
												data-height="20" data-max-rows="1" data-show-faces="true"></p:commandLink>
												
												
 <h:commandLink id="facebook" actionListener="#{userSession.socialConnect()}" >
<f:setPropertyActionListener target="#{userSession.providerID}" value="facebook" />
<i class="fa fa-facebook"></i>
</h:commandLink>
												

							</h:form>
								
						</div>						
					</div>

				</div>
			</div>

			<div class="navbar navbar-default" role="navigation">
			<div class="container">
				<!-- Brand and toggle get grouped for better mobile display -->
				<a class="navbar-brand hidden-lg hidden-md hidden-sm" href="#"><img src="#{request.contextPath}/img/logomarket3.png" style="width: 40px; height: auto;"/></a>
				<div class="navbar-header">
					<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
						<span class="sr-only">Toggle navigation</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
				</div>

		
				<!--  /////////////////////////////////////////////////////////////////////////////////////////////////////////  -->


				<!-- Collect the nav links, forms, and other content for toggling -->
				<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
					<ul class="nav navbar-nav">
						<li class="dropdown">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown">Categorias  <b class="caret"></b></a>
							<ul class="dropdown-menu animated fadeInUp" >								
								<h:form class="" id="categorias">
							        <p:dataGrid value="#{subcategoriaBean.categoriasConSubcategorias}"
							        			columns="3" var="c" style="border:none;" >
								        	
					        			<h:commandLink actionLink="#{c.nombre}"><li>#{c.nombre}</li></h:commandLink>
	    								        <p:dataGrid value="#{subcategoriaBean.obtenerSubcategorias(c.nombre)}"
	    								        			columns="1" var="sc" style="border:none;" >
											<h:commandLink actionLink="contenidoDigitalBean.obtenerContenidosPorSubcategoria(sc.nombre)"><li>#{sc.nombre}</li></h:commandLink>									        			
										</p:dataGrid>
									</p:dataGrid>
								</h:form>
							</ul>
						</li>
						<li>
							<a href="#" class="" data-toggle="dropdown">Top Pagas</a>
						</li>
					</ul>

			    <!--  Para probar facebook -->
				<!-- <div style="float:right;">
					<iframe width="200" height="60" src="loginFacebook.html" scrolling="no" frameborder="no" ></iframe>
				</div> -->	    	    

			    <!-- Con esto aca deshabilita el item al estar en formato chico para tablets o celulares -->
				<!-- <div id="search-header" class="hidden-xs animated bounceInRight"> -->
				
				<form id="search-header" class="navbar-form navbar-right" role="search">
					<div class="input-group">
						<input class="form-control" type="text" placeholder="Buscar app ..."/>
						<span class="input-group-btn">
							<button class="btn btn-default" type="button">
								<!-- <i class="fa fa-search"></i> -->
								<span class="glyphicon glyphicon-search"></span>								
							</button>
						</span>
					</div>
				</form>

			  </div><!-- /.navbar-collapse -->
			  </div>
			</div>
		
			<div class="post">
				<ui:insert name="index"></ui:insert>
				<ui:insert name="adminRegistro"></ui:insert>
				<ui:insert name="adminListar"></ui:insert>
				<ui:insert name="adminModificar"></ui:insert>
				<ui:insert name="categoriaRegistro"></ui:insert>
				<ui:insert name="categoriaListar"></ui:insert>
				<ui:insert name="subcategoriaRegistro"></ui:insert>
				<ui:insert name="subcategoriaListar"></ui:insert>
				<ui:insert name="cdRegistro"></ui:insert>
				<ui:insert name="cdListar"></ui:insert>
				<ui:insert name="versionRegistro"></ui:insert>
				<ui:insert name="versionListar"></ui:insert>
				<ui:insert name="itemsCD"></ui:insert>
				<ui:insert name="clienteRegistro"></ui:insert>
				<ui:insert name="proveedorRegistro"></ui:insert>
			</div>

		
			<div>
				<div id="footer-widgets" class="container" style="width:auto; text-align: center;">
					<div class="col-md-4" style="padding: auto;">
						<div>
							<h5 class="footer-widget-title">Usuarios</h5>
							<ul class="list-unstyled">
								<li>
									<a href="#{request.contextPath}/clienteRegistro.xhtml"><span class="glyphicon glyphicon-edit"></span> Registrarse </a>
								</li>							
								<li>
									<a href="#{request.contextPath}/login.xhtml"><span class="glyphicon glyphicon-log-in"></span> Acceder </a>
								</li>
							</ul>
						</div>
					</div>
					
					<div class="col-md-4">
						<div>
							<h4 class="footer-widget-title">Proveedores</h4>
							<ul class="list-unstyled">
								<li>
									<a href="#{request.contextPath}/proveedorRegistro.xhtml"><span class="glyphicon glyphicon-edit"></span> Registrarse </a>
								</li>							
								<li>
									<a href="#{request.contextPath}/login.xhtml"><span class="glyphicon glyphicon-log-in"></span> Acceder </a>
								</li>
							</ul>
						</div>
					</div>
					
					<div class="col-md-4">
						<div>
							<h4 class="footer-widget-title">Administradores</h4>
							<ul class="list-unstyled">
								<li>
									<a href="#{request.contextPath}/login.xhtml"><span class="glyphicon glyphicon-log-in"></span> Acceder </a>
								</li>
							</ul>
						</div>
					</div>
				</div>
			
				<div id="footer" class="copyright" style="background-color:#101010; height: auto;">
					<div>
					
						<div style="float: right; text-align: right; vertical-align: baseline;">
							<div><a href="mailto:sabri435@gmail.com?subject=Consultas">  Cortes, Yesica  | <span class="glyphicon glyphicon-envelope"></span></a></div>
							<div><a href="mailto:fedegarcia25@gmail.com?subject=Consultas">  Garcia, Federico | <span class="glyphicon glyphicon-envelope"></span></a></div>
							<div><a href="mailto:fabiw89@gmail.com?subject=Consultas">  Palermo, Fabricio | <span class="glyphicon glyphicon-envelope"></span></a></div>
						</div>				
					
						<div>
							<!-- <img src="../img/logomarket2.png" style="width:30px"></img> -->
							<span>  Universidad de la Republica | Facultad de Ingenieria  </span> 
							<!-- <span class="glyphicon glyphicon-link"></span> -->
						</div>
						
						<div >
							<!-- <img src="../img/logomarket2.png" style="width:30px"></img> --> 
							<span>  Administracion Nacional de Educacion Publica | Consejo de Educacion Tecnico Profesional  </span>
							<!-- <span class="glyphicon glyphicon-link"></span> -->
						</div>
						
						<div> Tecnologo en Informatica | Segundo Semestre | Grupo 1 | 2013</div>					
					</div>
					
				</div>				
			</div>

		</h:body>
	</f:view>
</html>
